<template>
	<view>
		<view class='order_body'>
			<view class='order_info'>
				<view class='order_info_item'>
					<view class='order_info_title'>营业额 (元)</view>
					<view class='order_num'>{{shop.orderSumPrice}}989898</view>
				</view>
				<view class='order_info_item'>
					<view class='order_info_title'>已兑换</view>
					<view class='order_num'>{{shop.orderSum}}100</view>
				</view>
				<view class='order_info_item'>
					<view class='order_info_title'>未兑换</view>
					<view class='order_num'>0</view>
				</view>
			</view>
			<view class='order_info'>
				<view class='order_info_item'>
					<view class='order_info_title'>题目总数</view>
					<view class='order_num'>{{shop.orderSumPrice}}989898</view>
				</view>
				<view class='order_info_item'>
					<view class='order_info_title'>错题数</view>
					<view class='order_num'>{{shop.orderSum}}100</view>
				</view>
				<view class='order_info_item'>
					<view class='order_info_title'>浏览人数</view>
					<view class='order_num'>0</view>
				</view>
			</view>
		</view>

		<view class='pending_body'>
			<view class='pending_block'>
				待兑换 <text>0</text>
			</view>
			<view class='pending_block left_line'>
				已兑换 <text>0</text>
			</view>
		</view>

		<view class='func_list'>
			<view v-for='(v,k) in funcList' :key="k" class='func_item' :class="(k+1)%3==2?'func_item_line':''"
				hover-class='click_btn' @click.stop="$tools.toPage(v.path)">
				<view class="func_item_icon iconfont" :class="v.icon"></view>
				<view class='func_item_title'>{{v.title}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				shop:{},
				funcList: [{
					icon: "iconshezhi",
					title: "兑换管理",
					path:'pages/admin/exchange'
				}, {
					icon: "iconshezhi",
					title: "兑换订单",
					path:'pages/admin/order'
				}, {
					icon: "iconshezhi",
					title: "用户管理",
					path:'pages/admin/user'
				}, {
					icon: "iconshezhi",
					title: "收藏列表",
					path:'pages/admin/collect'
				}, {
					icon: "iconshezhi",
					title: "题库分类",
					path:'pages/admin/brushCategory'
				}, {
					icon: "iconshezhi",
					title: "题库列表",
					path:'pages/admin/brushList'
				}, {
					icon: "iconshezhi",
					title: "历年真题",
					path:'pages/admin/brushBefore'
				}, {
					icon: "iconshezhi",
					title: "上传题库",
					path:'pages/admin/brushManage'
				}, {
					icon: "iconshezhi",
					title: "平台设置",
					path:'pages/admin/shopSetting'
				}]
			}
		},
		methods: {

		}
	}
</script>

<style lang="scss">
	page {
		background: #f2f2f2;
	}

	.order_body {
		background: $themeColor;
		width: 94%;
		color: #fff;
		margin: 3%;
		padding-top: 20rpx;
		border-radius: 15rpx;
		position: relative;
	}

	.setting {
		position: absolute;
		top: 20rpx;
		right: 40rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 28rpx;
		width: 150rpx;
		padding: 15rpx;
	}

	.setting_icon {
		font-size:35rpx;
	}

	.shop_info {
		text-align: center;
		margin: 15rpx 0;
	}

	.shop_logo {
		width: 120rpx;
		height: 120rpx;
		border-radius: 50%;
		background: #ccc;
	}

	.shop_name {
		width: 50%;
		font-size: 35rpx;
		margin-top: 20rpx;
		margin-left: 25%;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.order_info {
		display: flex;
		justify-content: space-around;
		font-size: 25rpx;
		margin-top: 15rpx;
		height: 120rpx;
	}

	.order_num {
		text-align: center;
		margin-top: 10rpx;
		font-size: 35rpx;
	}

	.order_info_big {
		font-size: 45rpx;
	}

	/* 待处理 */
	.pending_body {
		display: flex;
		justify-content: space-around;
		background: #fff;
		font-size: 25rpx;
		color: #555;
		padding: 20rpx 0;
	}

	.left_line {
		border-left: 1rpx #ddd solid;
	}

	.pending_block {
		width: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.pending_block text {
		font-size: 35rpx;
		color: $themeColor;
		margin-left: 20rpx;
	}

	/* 功能栏 */
	.func_list {
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
		margin-top: 25rpx;
		border-bottom: 1rpx #ededed solid;
		background: #fff;
	}

	.func_item_icon {
		font-size: 65rpx;
	}

	.func_item {
		width: 33%;
		text-align: center;
		padding: 25rpx 0;
		border-bottom: 1rpx #eee solid;
	}

	.func_item_line {
		border-left: 1rpx #eee solid;
		border-right: 1rpx #eee solid;
	}

	.func_item_title {
		font-size: 30rpx;
		letter-spacing: 2rpx;
		color: #555;
	}

	.click_btn {
		opacity: 0.8;
		background: #f2f2f2;
		transform: scale(0.9);
	}
</style>